<template>
<div>

    <!-- 搜索 -->
        <div class="search_list">

            <div class="search_out">
                <span class="han_text">姓名</span>
                <el-input v-model="name" placeholder="请输入关键字"/>
            </div>
            
            <el-button  type="primary" icon="el-icon-search" @click="searchName">搜索</el-button>
        </div>

    <div>
        <el-button type="text" @click="dialogTableVisible = true">添加账号</el-button>
    </div>
    <!-- 列表 -->
    <el-table :data="list" stripe style="width: 100%">
        <el-table-column prop="user" label="账号"></el-table-column>
        <el-table-column prop="createTime" label="创建时间">
            <template slot-scope="scope">{{$getDate(scope.row.createTime)}}</template>
        </el-table-column>
        <el-table-column prop="nearTime" label="最近一次登录时间">
             <template slot-scope="scope">{{scope.row.nearTime?$getDate(scope.row.nearTime):'--'}}</template>
        </el-table-column>
       
        <el-table-column prop="status" label="操作">
            <template slot-scope="scope">
                <el-popconfirm title="你确定要冻结该账号吗" @onConfirm="editAdmin(scope.row.user)">
                    <el-button slot="reference" type="text" size="mini">{{scope.row.status==='ok'&&scope.row.user!=='admin'?'冻结':null}}</el-button>
                </el-popconfirm>
            </template>
        </el-table-column>  
    </el-table>

    
    <!-- 添加账号 -->
    <el-dialog title="添加账号" :visible.sync="dialogTableVisible">
        <div>
            <el-input placeholder="请输入账号" prefix-icon="el-icon-user" v-model="user"/>
            <el-input placeholder="请输入密码" prefix-icon="el-icon-lock" v-model="pwd"/>
            <el-button  type="primary" @click="dialogTableVisible = false">取消</el-button>
            <el-button  type="primary" @click="addAdmin">添加</el-button>
        </div>
    </el-dialog>
    
</div>
</template>
<script>
export default {
    data(){
        return {
            list:[],
            name:'',
            user:'',
            pwd:'',
            dialogTableVisible:false
        }
    },
    mounted(){
        this.initData();
    },
    methods:{
        initData(){
            this.$httpAxios(this.$api.ADMIN_LIST(),res=>this.list = res.data)
        },
        searchName(){
                // 模糊搜索
        },
        addAdmin(){
            const {user,pwd} = this;
            this.$httpAxios(this.$api.ADMIN_ADD({user,pwd}),res=>{

                this.$alert(res.msg, '系统提示', {
                    confirmButtonText: '确定',
                    callback: () => {
                        this.initData();
                        this.dialogTableVisible = false
                    }
                })
                
            })
        },
        editAdmin(user){
            console.log(user)
             this.$httpAxios(this.$api.ADMIN_EDIT({user}),res=>{
                this.$message.success(res.msg)
                this.initData();       
            })
        }
    } 
    
}
</script>